{% extends "layouts/main.html" %}
{% import 'components/utils.html' as utils %}
{% import 'components/form.html' as helper %}

{% set pageTitle = "用户信息" %}
{% set pageDesc = user.nickname %}

{% block content %}

<div class="row">
    <div class="col-md-3">

        <!-- Profile Image -->
        <div class="box box-primary">
            <div class="box-body box-profile">
                <!--<img class="profile-user-img img-responsive img-circle" src="../../dist/img/user4-128x128.jpg" alt="User profile picture">-->

                <h3 class="profile-username text-center">{{ user.nickname }}</h3>

                <p class="text-muted text-center">{{ user.username }}</p>

                <ul class="list-group list-group-unbordered">
                    <!--<li class="list-group-item">-->
                        <!--<b>Followers</b> <a class="pull-right">1,322</a>-->
                    <!--</li>-->
                    <li class="list-group-item">
                        <b>关注的</b> <a class="pull-right">{{ user.followed.count() }}</a>
                    </li>
                    <!--<li class="list-group-item">-->
                        <!--<b>Friends</b> <a class="pull-right">13,287</a>-->
                    <!--</li>-->
                </ul>

                <a href="{{ url_for('main.delete_user', id=user.id) }}" class="btn btn-danger btn-block"><b>删除用户</b></a>
            </div>
            <!-- /.box-body -->
        </div>
        <!-- /.box -->

    </div>
    <!-- /.col -->
    <div class="col-md-9">
        <div class="nav-tabs-custom">
            <ul class="nav nav-tabs">
                {% set which_form = (which_form in [None, '1']) %}
                <li class="{{ 'active' if which_form }}"><a href="#edit" data-toggle="tab">用户信息</a></li>
                <li class="{{ 'active' if not which_form }}"><a href="#change-passwd" data-toggle="tab">修改密码</a></li>
                <li><a href="#followed" data-toggle="tab">关注的</a></li>
            </ul>
            <div class="tab-content">
                <div class="{{ 'active' if which_form }} tab-pane" id="edit">
                    <form class="form-horizontal" method="post">
                        <input type="hidden" name="form" value="1">
                        {{ form.hidden_tag() }}
                        {{ helper.render_edit(form.nickname) }}
                        {{ helper.render_edit(form.username) }}
                        {{ helper.render_edit(form.role) }}
                        {{ helper.render_edit(form.status) }}
                        <div class="form-group">
                            <div class="col-sm-offset-2 col-sm-10">
                                {{ form.submit(class='btn btn-danger btn-flat') }}
                            </div>
                        </div>
                    </form>
                </div>
                <!-- /.tab-pane -->
                <div class="{{ 'active' if not which_form }} tab-pane" id="change-passwd">
                    <form class="form-horizontal" method="post">
                        <input type="hidden" name="form" value="2">
                        {{ form.hidden_tag() }}
                        {{ helper.render_edit(pform.new_password) }}
                        {{ helper.render_edit(pform.confirm_password) }}
                        <div class="form-group">
                            <div class="col-sm-offset-2 col-sm-10">
                                {{ form.submit(class='btn btn-danger btn-flat') }}
                            </div>
                        </div>
                    </form>
                </div>
                <!-- /.tab-pane -->

                <div class="tab-pane" id="followed">
                    {% if not follows %}
                        暂无关注
                    {% endif %}
                    <!-- The timeline -->
                    <ul class="timeline">
                        {% for f in follows %}
                            {% set timeline = f.time | format_date %}
                            {% if timeline != tmp or not tmp %}
                            {% set tmp = timeline %}
                                <li class="time-label">
                                    <span class="bg-red">{{ timeline }}</span>
                                </li>
                            {% endif %}
                                <!-- /.timeline-label -->

                                <!-- timeline item -->
                                <li>
                                    <!-- timeline icon -->
                                    <i class="fa fa-feed bg-blue"></i>
                                    <div class="timeline-item">
                                        <span class="time"><i class="fa fa-clock-o"></i>
                                            {{ f.time | format_date("%H:%M:%S") }}</span>

                                        <h3 class="timeline-header">
                                            关注<a href="{{ url_for('main.job_detail', id=f.job.id) }}">{{ f.job.title }}</a>
                                        </h3>
                                    </div>
                                </li>
                        {% endfor %}
                        <!-- END timeline item -->
                    </ul>
                </div>
                <!-- /.tab-pane -->
            </div>
            <!-- /.tab-content -->
        </div>
        <!-- /.nav-tabs-custom -->
    </div>
    <!-- /.col -->
</div>

{% endblock %}